import Taro, { Component } from '@tarojs/taro'
import { View } from '@tarojs/components'
import PropTypes from 'prop-types'
import classNames from 'classnames'
import styles from './index.module.scss'

export default class Index extends Component {
  props: any

  static propTypes = {
    //  类型
    type: PropTypes.oneOf(['overlay', 'popup']),
    //  圆角
    round: PropTypes.bool,
    //  style
    style: PropTypes.objectOf(PropTypes.string),
    //  事件
    onClick: PropTypes.func,
    //  显示
    visible: PropTypes.bool,
    //  位置
    position: PropTypes.oneOf(['fade', 'bottom']),
    //  内容
    children: PropTypes.any,
    //  类名
    className: PropTypes.string,
  }

  render() {
    const { type, round, style, onClick, visible, position, className } = this.props

    return (
      <View
        style={style}
        className={classNames(styles[type], {
          [styles.round]: round,
          [styles.enter]: !visible,
          [styles[position]]: position,
        }, className)}
        onClick={onClick}
      >
        {this.props.children}
      </View>
    )
  }
}
